<template>
    <view :style="themeColor()" class="bg-[var(--page-bg-color)] min-h-[100vh] overflow-hidden">
        <block v-if="!loading">
			<view class="pt-[20rpx] sidebar-margin">
				<view class="flex flex-col card-template">
					<view class="flex" :class="{'mb-[20rpx]': verifyInfo.value.list.length-1 != index}" v-for="(item,index) in verifyInfo.value.list" :key="index">
						<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-if="item.cover" :src="img(item.cover)"></image>
						<image class="w-[150rpx] h-[150rpx] rounded-[var(--goods-rounded-big)]" mode="aspectFill" v-else :src="img('addon/tourism/tourism/member/hotel.png')"></image>
						<view class="flex flex-col flex-1 ml-[20rpx] py-[4rpx]">
							<view class="leading-[40rpx] truncate max-w-[490rpx] text-[28rpx]">{{item.name}}</view>
							<view class="mt-[14rpx] truncate text-[24rpx] text-[var(--text-color-light9)] leading-[28rpx] max-w-[490rpx] " v-if="item.sub_name">
							{{ item.sub_name }}
							</view>
							<view class="text-[var(--text-color-light6)] text-[26rpx] mt-[20rpx]">x1</view>
						</view>
					</view>
				</view>
				
				<view class="flex flex-col card-template mt-[20rpx] text-[28rpx]">
					<view class="title">核销信息</view>
					<view class="card-template-item justify-between">
						<text class="text-[28rpx] text-[#333]">核销类型</text>
						<view class="text-[28rpx] text-[#333]">{{verifyInfo.type_name}}</view>
					</view>
					<view class="card-template-item justify-between">
						<text class="text-[28rpx] text-[#333]">核销状态</text>
						<view class="text-[28rpx] text-[#333]">已核销</view>
					</view>
					<view class="card-template-item justify-between">
						<text class="text-[28rpx] text-[#333]">核销时间</text>
						<view class="text-[#333333] text-[28rpx]">{{verifyInfo.create_time}}</view>
					</view>
					<view class="card-template-item justify-between">
						<text class="text-[28rpx] text-[#333]">核销人员</text>
						<view class="text-[#333333] text-[28rpx]">{{verifyInfo.member ? verifyInfo.member.nickname : '--'}}</view>
					</view>
					<view class="card-template-item justify-between" v-for="(item,index) in verifyInfo.value.content.fixed">
						<text class="text-[28rpx] text-[#333]">{{item.title}}</text>
						<view class="text-[28rpx] text-[#333]">{{item.value}}</view>
					</view>
				</view>
				
				<view v-for="(item,index) in verifyInfo.value.content.diy" :key="index" class="card-template top-mar">
					<view class="title">{{item.title}}</view>
					<view class="card-template-item justify-between" v-for="(subItem,subIndex) in item.list" :key="subIndex" :class="{'mt-30rpx' : subIndex == '0'}">
						<text class="text-[28rpx] text-[#333]">{{subItem.title}}</text>
						<view class="text-[28rpx] text-[#333]">{{subItem.value}}</view>
					</view>
				</view>
			</view>

        </block>
		<loading-page :loading="loading"></loading-page>
    </view>
</template>

<script setup lang="ts">
    import { ref } from 'vue';
    import { onLoad,onShow } from '@dcloudio/uni-app'
	import { img,redirect, getToken } from '@/utils/common';
    import { getVerifyDetail } from '@/app/api/verify'
    import { t } from '@/locale'

    const loading = ref(true)
	const code = ref('');
    onLoad((option:any)=> {
	    if (option.code) code.value = option.code;
    })
	
	onShow(() => {
		if(getToken()){
			getVerifyDetailFn();
		}
	})
	
	const verifyInfo = ref({})
	const getVerifyDetailFn = ()=>{
		loading.value = true;
		getVerifyDetail(code.value).then((res:any) =>{
			verifyInfo.value = res.data;
			loading.value = false;
		})
	}
</script>
